<template>
  <div class="bolg-info">
    <h5>博客信息</h5>
    <ul class="info-card">
      <li>
        <div>
        <icon data="@icon/icon_time.svg" original />
        <span>文章数目</span>
        </div>
        <x-tag :name="39"></x-tag>
      </li>
      <li>
        <div>
        <icon data="@icon/icon_time.svg" original/>
        <span>文章数目</span>
        </div>
        <x-tag :name="39"></x-tag>
      </li>
      <li>
        <div>
        <icon data="@icon/icon_time.svg" original/>
        <span>文章数目</span>
        </div>
        <x-tag :name="39"></x-tag>
      </li>
      <li>
        <div>
        <icon data="@icon/icon_time.svg" original/>
        <span>文章数目</span>
        </div>
        <x-tag :name="111"></x-tag>
      </li>

    </ul>
  </div>
</template>

<script>
export default {
  name: "bolg-info"
}
</script>

<style scoped lang="scss">
@import "src/color";
.bolg-info{
  &>:first-child{
    margin-bottom: 10px;
  }
  .info-card{
    color: $c-a0a0a0;
    background-color: #fff;
    padding: 0 20px;
    >li{
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding:15px 0;
      font-size: 16px;
      &>:first-child{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        &>:first-child{
          margin-right: 10px;
        }
      }

    }
  }
}

</style>
